<template>
  <view id="editCode" class="page">
    <view class="top-title">请输入您的手机号码</view>
    <input
      v-model.trim="mobile"
      type="number"
      class="top-input"
      maxlength="11"
      placeholder="请输入手机号"
    />
    <view class="info">用于接受来电，通话时双方均显示虚拟号码，隐私更安全</view>
    <view id="keysPosition">
      <view class="title-plateNo">请绑定车辆信息</view>
      <key-board
        :carNum="carNum"
        :resetPlate="resetPlate"
        @onOk="onOk"
        @keyBoardShow="keyBoardShow"
        :showKeyboard="false"
        bind:onCancel="onCancel"
        id="keyBoard"
      />
      <view class="btn-submit" @tap="onSubmit">确定</view>
    </view>
  </view>
</template>
<script>
import Taro from "@tarojs/taro";
import "./editCode.less";
import keyBoard from "../../../components/keyBoard/keyBoard.vue";
import { setGlobalData, getGlobalData } from "../../../globalData.js";
import { checkMobile, checkPlateNo } from "../../../check.js";
import bulterApi from "@souche2014/bulter-api";
const api = bulterApi({ partner: "IOParking" });
const API_CarCode = process.env.IOParking.API_CARCODE;
export default {
  name: "editCode",
  data() {
    return {
      checkMobile,
      checkPlateNo,
      showKeyboard: false,
      plate: "", //车牌号
      resetPlate: [], //历史车辆点击录入
      apiBaseUrl: process.env.IOParking.API_HOST, //请求头部
      mobile: "",
      hasPhone: false,
      moveCarCodeNo: "", //挪车码
    };
  },
  //mixins:[authorize],
  components: { keyBoard },
  mounted() {},

  onLoad: function (options) {
    this.moveCarCodeNo = decodeURIComponent(options.no);
    this.mobile = options.mobile;
    this.plate = options.plateNo;
    this.resetPlate = this.plate.split("");
    console.log("参数:", JSON.stringify(options));
    if (!getGlobalData("openId")) {
      this.wx_login();
    }
  },
  created() {},
  methods: {
    wx_login() {
      api
        .getUserInfo({
          scope: "all",
        })
        .then((resp) => {
          if (resp.success) {
            if (resp.data == "mock") {
              return;
            }
            this.getInfos(resp.data);
          } else {
            console.log("err is ", resp.message, "err code is ", resp.code);
          }
        });
    },
    getInfos(authCode) {
      Taro.request({
        url: this.apiBaseUrl + "/weixin/souchegetuser?authCode=" + authCode,
        data: {},
        header: {
          "content-type": "application/json", // 默认值
        },
        method: "GET",
        success: (res) => {
          if (res.data.isSuccess) {
            var userOpenId = res.data.data.openId;
            setGlobalData("openId", userOpenId);
          }
        },
      });
    },
    closeKeyBord() {
      this.showKeyboard = false;
    },
    //车牌号查询
    onOk(e) {
      this.plate = e;
    },
    keyBoardShow(e) {
      if (e) {
        console.log(document.getElementById("keysPosition"));
        document.getElementById("keysPosition").style.paddingBottom = "250px";
        Taro.createSelectorQuery()
          .select("#keysPosition")
          .boundingClientRect(function (rect) {
            // 使页面滚动到底部
            Taro.pageScrollTo({
              scrollTop: rect.bottom,
            });
          })
          .exec();
      } else {
        document.getElementById("keysPosition").style.paddingBottom = "0px";
      }
    },
    onCancel() {},
    plateReset(e) {
      this.resetPlate = e.split("");
      this.plate = e;
    },
    //回到主页
    goHome() {
      api.openPage("home");
    },
    //解析链接方法
    getQueryString(url, name) {
      var reg = new RegExp("(^|&|/?)" + name + "=([^&|/?]*)(&|/?|$)", "i");
      var r = url.substr(1).match(reg);
      if (r != null) {
        return r[2];
      }
      return null;
    },
    onSubmit() {
      if (!checkMobile(this.mobile)) {
        Taro.showToast({
          title: "手机号码格式错误",
          icon: "error",
          duration: 1000,
          mask: true,
        });
        return;
      }
      if (!checkPlateNo(this.plate.substr(1))) {
        Taro.showToast({
          title: "车牌号不正确",
          icon: "error",
          duration: 1000,
          mask: true,
        });
        return;
      }
      Taro.showLoading({
        title: "加载中",
        mask: true,
      });
      let params = {
        code: this.moveCarCodeNo,
        plateNo: this.plate,
        mobile: this.mobile,
        openId: getGlobalData("openId"),
        state: 1,
      };
      let url = API_CarCode + "carmovingcode/register";
      Taro.request({
        url: url,
        data: params,
        header: {
          "content-type": "application/json", // 默认值
        },
        method: "POST",
        success: (res) => {
          Taro.hideLoading();
          if (res.data.isSuccess) {
            Taro.redirectTo({ url: "../myCode/myCode" });
          } else {
            Taro.showToast({
              title: res.data.message,
              icon: "error",
              duration: 1000,
              mask: true,
            });
          }
        },
      });
    },
    //end
  },
};
</script>

